---
title: "Vite"
description: "Set up Intent in your Vite project with React and Tailwind CSS using a quick and efficient installation process."
---

## Installation
Start a new project with the following command:
```bash
npm create vite@latest
```

Next, install Tailwind CSS along with the Tailwind CSS Vite plugin:
```bash
npm install tailwindcss @tailwindcss/vite
```

## Vite.config.ts
Now, open your `vite.config.ts` file and add the following to the `plugins` array:
```ts
import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'
import tailwindcss from '@tailwindcss/vite'

// https://vite.dev/config/
export default defineConfig({
  plugins: [
    tailwindcss(),
    react()
  ],
})
```

## Tsconfig.json
To ensure proper path resolution, update your `tsconfig.json` file with the following paths:
```json
{
  "files": [],
  "references": [
    {
      "path": "./tsconfig.app.json"
    },
    {
      "path": "./tsconfig.node.json"
    }
  ],
  "compilerOptions": {
    "baseUrl": ".",
    "paths": {
      "@/*": ["./src/*"]
    }
  }
}
```

## Install Intent UI
After you setup all the necessary configurations, you can install Intent UI by running the following command:
```bash
npx shadcn@latest init @intentui/theme-default
```

## Adding Components
Add Intent components to your project with the following command:
```bash
npx shadcn@latest add @intentui/text-field @intentui/button @intentui/menu
```

## Other Framework
You might be interested in using Intent with other frameworks.
<FrameworkGuides/>
